<div id="installInterface" class="container" style="width:1080px;">
  <!--左侧导航-->
  <div class="col-md-3 menu" ng-include="'pages/menu.html'"></div>
  <!--内容-->
  <div class="col-md-9 col-md-offset-3 list-group config-nav" style="padding-left: 0;">

    <!--执行日志-->
    <div class="list-group config-nav" ng-class="isLogFull?'log-full':''" id="installInterface-log" style="margin-bottom: -1px;display: none">
      <b class="list-group-item title">执行日志
        <a style="float:right;cursor:pointer" ng-click="logFull(isLogFull)">
          <i style="margin:0" class="fa" ng-class="isLogFull?'fa-compress':'fa-expand'"></i>
        </a>
      </b>
      <div class="list-group-item form-horizontal" style="padding: 0;">
        <div class="console" style="height: 150px;padding: 10px;overflow: auto;font-family: monospace">
          <div class="log-panel" ng-repeat="log in runLogs track by $index">
            <span class="line-num cantSel">{{($index+1)}}</span>
            <div class="log">{{log}}</div>
          </div>
        </div>
      </div>
    </div>

    <!-- 实时接口注意事项 -->
    <div class="list-group config-nav" style="margin-bottom: -1px;" ng-show="hasTips">
      <div class="list-group-item form-horizontal" style="padding: 0;">
        <div class="console" style="padding: 10px;font-family: monospace">
          <!--实时-->
          <div class="log-panel">
            <span class="line-num cantSel"></span>
            <div class="log" style="font-weight:bold;line-height:2;">请在安装接口之前手动执行实时表或者视图，步骤如下：</div>
          </div>
          <div class="log-panel">
            <span class="line-num cantSel">1</span>
            <div class="log" style="color:red;">点击接口包名称，显示该接口安装步骤，若安装步骤中存在“**_R.SQL”，则根据以下说明操作；若不存在，则跳过</div>
          </div>
          <div class="log-panel">
            <span class="line-num cantSel">2</span>
            <div class="log" style="color:red;">若该接口实时监控源表为采集，则点击“**_R.SQL”一行右侧的“安装接口” 若该接口实时监控源表为同步，则在同步后，点击“**_r_view.SQL”一行右侧的“安装接口”
            </div>
          </div>
          <div class="log-panel">
            <span class="line-num cantSel">3</span>
            <div class="log" style="color:red;">完成接口部署后，请查看“内控4.0调度2.0接口部署说明.docx”文档，根据说明禁用相关实时任务！</div>
          </div>
        </div>
      </div>
    </div>

    <!--接口列表-->
    <div class="list-group config-nav" style="margin-bottom: 15px;">
      <b class="list-group-item title">所有接口
        <div style="display: inline-block;float: right">
          <a href="javascript:void(0)" style="margin-right: .8em;" ng-show="!installing" ng-click="importInstall()">
            导入安装包
          </a>
          <a href="javascript:void(0)" style="margin-right: .8em;" class="text-danger" ng-show="!installing" ng-click="delPkgs()">
            清空安装包
          </a>
          <a href="javascript:void(0)" ng-class="!compileFlag?'disabled':''" ng-click="!compileFlag?'':compileDialog()">
            查看编译失效对象
          </a>
        </div>
      </b>
      <ul class="list-group config-nav">
        <a class="list-group-item noTip" ng-show="!sqlListPkgs||sqlListPkgs.length==0">暂无</a>
        <li class="list-group-item" ng-repeat="sqlListPkg in sqlListPkgs">
          <b style="display: block; position: relative">
            <!--包名-->
            <span class="pkgName" ng-click="collapseFnc($index)" style="padding-left: 0">
              {{sqlListPkg.name}}
            </span>
            <!--包操作-->
            <div style="display: inline-block;float: right">
              <a style="cursor: pointer;margin-right: .8em" ng-click="onePackage($index)" ng-show="!installing">安装接口包</a>
              <a style="cursor: pointer;margin-right: .8em" ng-click="getLog(sqlListPkg.name,'')">查看日志</a>
              <div class="checkbox" style="display: inline-block;margin: 0 .8em 0 0;">
                <label class="cantSel">
                  <input type="checkbox" ng-model="sqlListPkg.checked" ng-disabled="installing" ng-click="changeCheckbox(true)"> {{sqlListPkg.checked?"已全部安装":"未全部安装"}}
                </label>
              </div>
              <a style="cursor: pointer;" class="text-danger" ng-click="delPkg(sqlListPkg.name)" ng-show="!installing">删除</a>
            </div>
            <div style="clear:both"></div>
          </b>
          <table class="table" ng-show="collapse[$index]" style="margin-top: 10px; border-top:1px solid #ddd;">
            <tr ng-repeat="sql in sqlListPkg.sqlList" data-toggle="tooltip" data-placement="left" title="{{sql.tips}}">
              <td style="width:10px;">
                <label class="checkbox alert" ng-class="sql.checked?'alert-success':'alert-danger'" style="margin: 0;padding: 3px 8px;">
                  <!-- <label class="cantSel" style="vertical-align: middle;"> -->
                  <input style="position: relative;margin: 0;vertical-align: middle;" type="checkbox" ng-model="sql.checked" ng-disabled="installing"
                    ng-click="changeCheckbox()">
                  <!-- {{sql.checked?"已完成":"未安装"}} -->
                  <!-- </label> -->
                </label>
              </td>
              <td>
                {{sql.name}}
              </td>
              <td>
                <div class="progress" ng-show="sqlListPkg.name==installingPkg && sql.name==installingSql" style="float: right;margin:5px 0;background: #eee;width: 138px; border-radius: 3px!important;">
                  <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
                    style="width: 100%">
                  </div>
                </div>

                <div class="btn-group btn-group-sm" ng-hide="sqlListPkg.name==installingPkg && sql.name==installingSql">
                  <button ng-disabled="installing" type="button" class="btn" ng-class="sql.checked?'btn-default':'btn-primary'" style="border-radius: 0!important;"
                    ng-click="oneSql(sqlListPkg.name,sql.name,sql.tips)">
                    {{sql.checked?"重新安装": sqlListPkg.name==installingPkg && sql.name==installingSql?"安装中...": "安装接口"}}
                  </button>
                  <button type="button" ng-show="sql.single" class="btn btn-default" ng-click="getLog(sqlListPkg.name,sql.name,sql.tips)" style="border-radius: 0!important;">查看日志
                  </button>
                </div>
              </td>
            </tr>
          </table>
        </li>
      </ul>
    </div>
  </div>
</div>

<!--上/下一步-->
<a ng-show="!installing" href="#!/installDB" class="step-btn left" data-toggle="tooltip" data-placement="right" title="返回">
  <i class="iconfont icon-back"></i>
</a>
<a ng-show="!installing" ng-click="submitFnc()" class="step-btn right" ng-class="loadingNext?'loading':''" data-toggle="tooltip"
  data-placement="left" title="下一步">
  <i class="iconfont icon-right text-primary"></i>
</a>

<!--日志Dialog-->
<div class="modal bs-example-modal-lg fade console" id="installInterface-console" tabindex="-1" role="dialog">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
        <h4 class="modal-title">运行日志</h4>
      </div>
      <div class="modal-body" style="font-family: monospace">
        <div class="load-tip" ng-show="logs.length==0">无日志</div>
        <div class="log-panel" ng-repeat="log in logs track by $index">
          <span class="line-num cantSel">{{($index+1)}}</span>
          <div class="log">{{log}}</div>
        </div>
      </div>
    </div>
  </div>
</div>

<!--提示Dialog-->
<div class="modal fade" id="installInterface-confirm" bindex="-1" role="dialog" data-keyboard="false" data-backdrop="static">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">提示</h4>
      </div>
      <div class="modal-body">
        备份出错，是否停止安装？请确保数据备份完成后再继续！
      </div>
      <div class="modal-footer">

        <div class="progress" ng-show="setManagerFlag" style="float: left; width: 375px;background: #eee;margin: 7px 0 0;">
          <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
            style="width: 100%">
          </div>
        </div>

        <button type="button" class="btn btn-default" ng-click="confirmNo()" data-dismiss="modal">停止升级</button>
        <button type="button" class="btn btn-primary" ng-click="confirmBackup()" ng-show="!isPlatform">重新备份并继续</button>
        <button type="button" class="btn btn-primary" ng-click="confirmYes()">已备份并继续
        </button>
      </div>
    </div>
  </div>
</div>

<!--验证密码Dialog-->
<div class="modal fade bs-example-modal-sm" id="installInterface-manger" bindex="-1" role="dialog" data-keyboard="false"
  data-backdrop="static">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">sysdba用户和密码</h4>
      </div>
      <div class="modal-body">
        <div class="form-group">
          <label class="control-label">用户名:</label>
          <input type="text" class="form-control" placeholder="点击输入" ng-model="manager.manager">
        </div>
        <div class="form-group">
          <label class="control-label">密码:</label>
          <input type="password" class="form-control" placeholder="点击输入" ng-model="manager.password">
        </div>
      </div>
      <div class="modal-footer">

        <div class="progress" ng-show="setManagerFlag" style="float: left; width: 375px;background: #eee;margin: 7px 0 0;">
          <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
            style="width: 100%">
          </div>
        </div>

        <button type="button" class="btn btn-default" ng-click="yesManager()" ng-show="continueType.isPackage">已手工执行grant.sql</button>
        <button type="button" class="btn btn-default" ng-click="stopManager()" data-dismiss="modal">停止安裝</button>
        <button type="button" class="btn btn-primary" ng-click="setManager(manager)" ng-disabled="setManagerFlag">验证权限
        </button>
      </div>
    </div>
  </div>
</div>

<!--注意事项Dialog-->
<div class="modal bs-example-modal-lg fade" id="installInterface-notice" tabindex="-1" role="dialog" data-keyboard="false"
  data-backdrop="static">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">注意事项</h4>
      </div>
      <div class="modal-body" style="font-family: monospace">
        <div style="white-space: pre-line">{{readme}}</div>
      </div>

      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">我已阅读并继续</button>
      </div>

    </div>
  </div>
</div>

<!--导入安装包Dialog-->
<div class="modal fade" id="installInterface-import-dialog" tabindex="-1" role="dialog" data-keyboard="false" data-backdrop="static">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">Package目录下接口安装包：</h4>
      </div>
      <div class="modal-body import-pkgs">
        <div class="import-pkg" ng-repeat="importPkg in importPkgs" ng-class="addPkgs.indexOf(importPkg)!=-1?'sel':''" ng-click="importing?'':addImports(importPkg)">
          <i class="fa fa-file-zip-o"></i>
          <div> {{importPkg}}</div>
        </div>
      </div>
      <div class="modal-footer" style="padding: 10px 15px;">
        <button type="button" class="btn btn-default" ng-disabled="importing" data-dismiss="modal">取消</button>
        <button type="button" class="btn btn-primary" ng-disabled="importing||addPkgs.length==0" ng-click="addImport(importPkgs.sel)">
          <i class="fa fa-cog fa-spin fa-fw" ng-show="importing"></i>
          {{addPkgs.length==0?'未选择安装包':importing?'导入中':'导入选中安装包'}}
        </button>
      </div>
    </div>
  </div>
</div>

<!--版本检测提示Dialog-->
<div class="modal fade bs-example-modal-sm" id="installInterface-version" bindex="-1" role="dialog" data-keyboard="false"
  data-backdrop="static">
  <div class="modal-dialog modal-sm" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">提示</h4>
      </div>
      <div class="modal-body">
        当前版本无需升级，需要继续升级？
      </div>
      <div class="modal-footer">

        <div class="progress" ng-show="setManagerFlag" style="float: left; width: 375px;background: #eee;margin: 7px 0 0;">
          <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
            style="width: 100%">
          </div>
        </div>

        <button type="button" class="btn btn-default" ng-click="versionNo()" data-dismiss="modal">停止升级</button>
        <button type="button" class="btn btn-primary" ng-click="versionYes()">继续升级
        </button>
      </div>
    </div>
  </div>
</div>

<!--查看编译失效对象Dialog-->
<div class="modal bs-example-modal-lg fade" id="installInterface-compile-dialog" tabindex="-1" role="dialog">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
        <h4 class="modal-title">编译失效对象：共{{compileItemsTotal}}条记录</h4>
      </div>
      <div class="modal-body">
        <!--数据-->
        <div style="min-height: 410px;">
          <table class="table table-striped table-bordered" style="margin-bottom: 0">
            <thead>
              <tr>
                <th>objectName</th>
                <th>objectType</th>
                <th>owner</th>
                <th>status</th>
              </tr>
            </thead>
            <tbody>
              <tr ng-repeat="item in compileItems">
                <td>{{item.objectName}}</td>
                <td>{{item.objectType}}</td>
                <td>{{item.owner}}</td>
                <td>{{item.status}}</td>
              </tr>
            </tbody>
          </table>
        </div>
        <!--分页-->
        <nav aria-label="Page navigation" style="text-align: center">
          <ul class="pagination" style="margin: 15px 0 0">
            <!--第一页-->
            <li ng-class="nowPage==1?'disabled':''">
              <a href="javascript:void(0)" ng-click="changePage(1)" aria-label="Previous">
                <span aria-hidden="true">&lt;&lt;</span>
              </a>
            </li>
            <!--上一页-->
            <li ng-class="nowPage==1?'disabled':''">
              <a href="javascript:void(0)" ng-click="changePage(nowPage-1)" aria-label="Previous">
                <span aria-hidden="true">&lt;</span>
              </a>
            </li>
            <!--页码-->
            <li ng-repeat="p in pages" ng-class="nowPage==p?'active':''">
              <a href="javascript:void(0)" ng-if="nowPage==p">{{p}}</a>
              <a style="cursor: pointer" ng-if="nowPage!=p" ng-click="changePage(p)" ng-hide="p<nowPage-calPage1||p>nowPage+calPage2">{{p}}</a>
            </li>
            <!--下一页-->
            <li ng-class="nowPage==pages.length?'disabled':''">
              <a href="javascript:void(0)" ng-click="changePage(nowPage+1)" aria-label="Next">
                <span aria-hidden="true">&gt;</span>
              </a>
            </li>
            <!--最后一页-->
            <li ng-class="nowPage==pages.length?'disabled':''">
              <a href="javascript:void(0)" ng-click="changePage(pages.length)" aria-label="Next">
                <span aria-hidden="true">&gt;&gt;</span>
              </a>
            </li>
          </ul>
        </nav>
      </div>
    </div>
  </div>
</div>